<template>
  <div class="activityApply">
    <Header-Comp title="活动报名" :leftIconCallback="leftChange" />
    <div class="content">
      <van-tabs v-model="active">
        <van-tab name="0" title="全部活动">
          <AllActivity v-if="active == 0" query />
        </van-tab>
        <van-tab name="1" title="我报名的">
          <MyApply v-if="active == 1" query />
        </van-tab>
      </van-tabs>
    </div>
  </div>
</template>

<script>
import AllActivity from "./components/AllActivity.vue";
import MyApply from "./components/MyApply.vue";
export default {
  name: "activityApply",
  components: {
    AllActivity,
    MyApply,
  },
  data() {
    return {
      active: 0,
      titleList: ["全部活动", "我报名的"],
      query: {},
    };
  },
  mounted() {
    if (this.$route.query.activeTab) {
      localStorage.setItem("activeIndex", this.$route.query.activeTab);
    }
    this.active = +localStorage.getItem("activeIndex") || 0;
  },
  provide() {
    let activityParams =
      this.$route.query || localStorage.getItem("activityParams");
    typeof activityParams === "string" &&
      (activityParams = JSON.parse(activityParams));
    localStorage.setItem("activityParams", JSON.stringify(activityParams));
    return {
      query: activityParams,
    };
  },
  methods: {
    leftChange() {
      localStorage.setItem("activeIndex", 0);
      document.title = "返回APP";
    },
  },
};
</script>

<style lang="less" scoped>
.activityApply {
  background-color: rgb(248, 245, 245);
  height: 100vh;
}
</style>
